<template>
  <div class="box1">
    <input type="text" v-model="arr.name" @keyup.enter="arr1" placeholder="请输入你的任务名称，按回车键确认"  />
  </div>
</template>
<script>
export default {
  data() {
    return {
        arr:{name:''}
    };
  },
  created() {},
  computed: {},
  methods: {
    arr1(){
        if(Boolean(this.arr.name)){
            let shu={
                name:'',
                complete:false
            }
            shu.name=this.arr.name
            this.$emit('arr1', shu)
            this.arr.name=''

        }else{
            alert('请输入你的任务名称，按回车键确认')
        }
        
    }
  },
};
</script>
<style lang='less' scoped>
.box1{
    input{
    width: 560px;
    height: 28px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 4px 7px;
  
}
  input:focus {
    outline: none;
    border-color: rgba(244, 65, 21, 0.8);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
                     0 0 8px rgba(236, 136, 82, 0.6);
  }
}
</style>
